﻿@using Web.ViewModel.CoreData

@{
    ViewBag.Title = "欢迎进入后台管理";
    Layout = "~/Views/Shared/_BackStageLayout.cshtml";
    List<UserModel> list = (List<UserModel>)ViewData["Data"];
}
<link href="/Content/assets/plugins/bootstrap-datepicker/css/datepicker.css" rel="stylesheet" />
<link href="/Content/assets/plugins/bootstrap-datepicker/css/datepicker3.css" rel="stylesheet" />
<div id="content" class="content">
    <!-- begin breadcrumb -->
    <ol class="breadcrumb pull-right">
        <li><a href="javascript:;">用户列表</a></li>
    </ol>
    <!-- end breadcrumb -->
    <!-- begin page-header -->
    <!-- end page-header -->
    <!-- begin row -->
    <div class="row">
        <!-- begin col-12 -->
        <div class="col-md-12">
            <!-- begin panel -->
            <div class="panel panel-inverse">
                <div class="panel-body">
                    <div class="table-responsive">
                        <table id="data-table" class="table table-striped table-bordered">
                            <thead>
                                <tr>
                                    <th>用户名</th>
                                    <th>许可号</th>
                                    <th>公司名</th>
                                    <th>管理船数</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach (var data in list)
                                {
                                    <tr class="odd ">
                                        <td>@data.UserName</td>
                                        <td>@data.Account</td>
                                        <td>@data.CompanyName</td>
                                        <td>@(data.MMSI==null?0: data.MMSI.Split(',').Length)</td>
                                        <td><button type="button" class="btn btn-primary btn-xs m-r-5 m-b-5 " userId="@data.Id" 
                                                    onclick="window.location.href = '/BackStage/AddUser?id=@data.Id'">更新信息</button>
                                            <button type="button" class="btn btn-primary btn-xs m-r-5 m-b-5 " userId="@data.Id"
                                                    onclick="window.open('/Home/Init?account=@data.Account&id=@data.Id')">
                                                查看用户报告
                                            </button>
                                            @*<button type="button" class="btn btn-primary btn-xs m-r-5 m-b-5 upd" userId="@data.Id"
                                                    onclick="window.location.href = '/BackStage/AddUser?id=@data.Id'">
                                                查看船舶列表
                                            </button>*@
                                            <button type="button" class="btn btn-primary btn-xs m-r-5 m-b-5 " 
                                                    onclick="SetExpirationDate('@data.Id')">
                                                设置有效时间
                                            </button>
                                        </td>
                                    </tr>
                                }
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <!-- end panel -->
        </div>
        <!-- end col-12 -->
    </div>
    <!-- end row -->
</div>



<div class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">关闭</span></button>
                <h4 class="modal-title">设置船舶有效使用时间</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal form-bordered">
                    <div class="form-group">
                        <label class="control-label col-md-4">有效使用时间</label>
                        <div class="col-md-8">
                            <input type="text" class="form-control expirationDate" name="expiration" id="expiration" placeholder="有效使用时间">
                            <ul class="parsley-errors-list filled"><li class="parsley-required">*设置该终端对应的所有船舶的有效使用时间</li></ul>
                        </div>
                    </div>
                </form>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-primary" id="save" data-dismiss="modal">确定</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

@section footer {
<script src="/Content/assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
<script src="/Content/assets/plugins/bootstrap-datepicker/js/locales/bootstrap-datepicker.zh-CN.js"></script>
    <script>
        var userId = "";
        $(document).ready(function () {
            $("body").load(function () {
                alert(1);
            });

            App.init();
            TableManageDefault.init();
            $('.expirationDate')
                        .datepicker({
                            language: 'zh-CN',
                            autoclose: true,
                            todayHighlight: true
                        });
           
            $("#save").click(function () {
                var expirationDate = $("#expiration").val();
                client.api.setUserExpirationDate({
                    "userId": userId, "expirationDate": expirationDate
                },
                    function (data) {
                        alert(data.ReMsg);
                        if (data.ReCode == "1000") {
                            $(".modal").hide();
                        }
                    },
            function (data) {

            });
            });

        });

        function SetExpirationDate(id) {
            userId = id;
            $(".modal").modal();

        }
    </script>
}
